;
var laytpl
var layer
layui.use(['laytpl', 'layer'], function () {
    laytpl = layui.laytpl;
    layer = layui.layer;
});

// 是否移动端
function isMobile() {
    return window.screen.width < 720;
}

function layerEnd() {
    $('.hot-layer-cancel').off('click')
    $('.hot-layer-confirm').off('click')
    $(".hot-layer-container").find("input,textarea").each(function () {
        $(this).val(null)
        $(this).prop({
            checked: false
        })
    });
}

function layerSuccess(elem, index, callback) {
    $(elem).find('.hot-layer-close').click(function () {
        layer.close(index)
        callback && callback.close && callback.close()
    })
    $(elem).find('.hot-layer-cancel').click(function () {
        layer.close(index)
        callback && callback.close && callback.close()
    })
    $(elem).find('.hot-layer-confirm').click(function () {
        layer.close(index)
        callback && callback.confirm && callback.confirm()
    })

    if(callback) {
        if (callback.msg) {
            $(elem).find('.hot-layer-content').text(callback.msg)
        }

        if (callback.title && callback.title !== 'hide_title') {
            $(elem).find('.hot-layer-title').text(callback.title)
        }
    }
}


// 显示文字热点内容
function hotspotTextPreview(spot_name, spot_detail) {
    if ($('#hotEditDrawer').hasClass('open')) {
        return
    }
    var textPreview = $('#textPreview')

    textPreview.find('.hot-layer-content').text(spot_detail)
    textPreview.find('.hot-layer-title').text(spot_name === 'hide_title' ? '' : spot_name)

    var area = isMobile() ? '300px' : '460px'
    layer.open({
        type: 1,
        title: false,
        resize: false,
        closeBtn: 0,
        area: area,
        skin: 'layer-hot',
        content:textPreview,
        success: function (elem, index) {
            layerSuccess(elem, index, {
                msg: spot_detail,
                title: spot_name
            })
        }
    })
}

function renderImagePreview(data) {
    var getTpl = imagePreviewTpl.innerHTML
    var thumbTpl = imageThumbPreviewTpl.innerHTML

    var view = document.getElementById('imagePreviewView');
    var thumbView = document.getElementById('thumbSwiperView')

    laytpl(getTpl).render(data, function (html) {
        view.innerHTML = html;
    });


    laytpl(thumbTpl).render(data, function (html) {
        thumbView.innerHTML = html
    });

    setTimeout(function () {
        initImagePreviewSwiper(data.list.length)
    }, 50)
}


function openImagePreview(images) {
    if (window.sessionStorage.getItem('isEdit') == 'true') {
        return
    }
    var list = images.split('|')

    if (WeixinFlag) {
        wx.previewImage({
            current: list[0],//当前显示图片的http链接，我这边是把图片转成了base64
            urls: list //需要预览的图片http链接列表
        });
    } else {
        // var area = isMobile() ? '100vw' : '900px'
        //
        // layer.open({
        //     type: 1,
        //     title: false,
        //     resize: false,
        //     closeBtn: 0,
        //     area: area,
        //     skin: 'layer-hot-image',
        //     // offset: '98px',
        //     content: $('#imagePreview'),
        //     shadeClose: false,
        //     shade: 0.8,
        //     success: function (elem, index) {
        //         renderImagePreview({
        //             list: list
        //         })
        //     },
        //     end: function () {
        //     }
        // })
        var data = []
        for (var i = 0; i < list.length; i++) {
            data.push({
                src: list[i]
            })
        }

        layer.photos({
            closeBtn: 1,
            photos: {
                data: data
            },
            anim: 5, //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
            success: function () {
                $(".layui-layer-phimg img").on("contextmenu", function () {
                    return false;
                });
                // $('#pano').hide();
                $('.layui-layer-imgbar').remove();
                changeImg2();

            }
        });
    }
}

function initImagePreviewSwiper(length) {
    $('.layui-layer-shade').click(function () {
        layer.closeAll()
    })

    var swiper = new Swiper(".thumbSwiper", {
        loop: false,
        spaceBetween: 14,
        slidesPerView: 6,
        freeMode: true,
        watchSlidesProgress: true,
    });

    var swiper2 = new Swiper(".imageSwiper", {
        loop: false,
        spaceBetween: 14,
        zoom: true,
        mousewheel: true,
        navigation: {
            nextEl: ".swiper-button-next",
            prevEl: ".swiper-button-prev",
        },
        thumbs: {
            swiper: swiper,
        },
    });
}